.content {
    width: 100%;
    height: 100vh;
}
.content .main{
    height: 93%;
    background-color: #F2F3F5;
}
.content .main .main_left{
    height: 100%;
    width: 40%;
    background-color: #FFFFFF;
    padding: 16px;
}
.content .main .main_left .order_status{
    margin-top: 10px;
}
.content .main .main_left .order_status .order_status_header {
    height: 30px;
    line-height: 30px;
}
.content .main .main_left .order_status .order_status_option{
    flex-wrap:wrap;
}
.content .main .main_left .order_status .order_status_option>.item{
    width: 42%;
    background-color: #F2F3F5;
    border-radius: 5px;
    padding: 5px 10px;
    margin-right: 8%;
    margin-bottom: 8px;
}
.content .main .main_left .order_status .order_status_option>.active{
    background-color: #337ECC;
    color: #FFFFFF;
}
.content .main .main_right {
    padding: 20px;
    width: 100%;
    overflow: auto;
}
.content .main .main_right .card_item{
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #DCDFE6;
    margin-bottom: 15px;
}
.content .main .main_right .null_status{
    color: #337ECC;
}
.content .main .main_right .null_status>.icon{
    transform: translate(0,5px);
}
.content .main .main_right .card_item .card_item_header{
    background-color: #337ECC;
    color: #FFFFFF;
    padding: 10px 15px;
    font-size: 14px;
}
.content .main .main_right .card_item .card_item_body{
    background-color: #FFFFFF;
    padding: 15px;
    color: #494A4C;
    border-bottom: 2px solid #EDEFF2;
}

.content .main .main_right .card_item .card_item_body .item_body_list {
    height: 25px;
    line-height: 25px;
    margin-bottom: 8px;
}
.content .main .main_right .card_item .card_item_body .card_item_mark{
    padding: 5px;
    background-color: #F0F2F5;
    border-radius: 5px;
    color: #9C9FA4;
}
.content .main .main_right .card_item .card_item_body .card_item_mark .item_mark_i{
    margin: 10px
}
.content .main .main_right .card_item .card_item_body .card_item_mark .item_mark_i .text{
    color: #494A4C;
}
.content .main .main_right .card_item .card_item_body .item_body_list .body_list_left>div{
    margin-right: 15px;
}
.content .main .main_right .card_item .card_item_body .item_body_list .body_list_left .label{
    background-color: #F0F2F5;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    text-align: center;
    color: #9C9FA5;
}
.content .main .main_right .card_item .card_item_foot{
    background-color: #FFFFFF;
    padding: 6px 12px;
    color: #494A4C;
}
.content .main .main_right .card_item .card_item_foot .item_foot_status_default{
    background-color: #ECF5FF;
    padding: 5px 10px;
    color: #4BA4FF;
    border-radius: 4px;
}
.content .main .main_right .card_item .card_item_foot .item_foot_status_success{
    background-color: #F0F9EB;
    padding: 5px 10px;
    color: #78C950;
    border-radius: 4px;
}
.content .main .main_right .card_item .card_item_foot .item_foot_status_warn{
    background-color: #f9ebeb;
    padding: 5px 10px;
    color: #c95050;
    border-radius: 4px;
}
.content .main .main_right .card_item .card_item_foot .item_foot_right{
    
}
.content .main .main_right .card_item .card_item_foot .item_foot_right>button{
    padding: 5px 10px;
    border: 1px solid #EDEFF2;
    margin: 0 5px;
    cursor: pointer;
    border-radius: 4px;
}
.content .main .main_right .card_item .card_item_foot .item_foot_right>button>.icon{
    transform: translate(0,2px);
    margin-right: 3px;
}
.content .main .main_right .card_item .card_item_foot .item_foot_right .daying{
}
.content .main .main_right .card_item .card_item_foot .item_foot_right .hand{
    background-color: #337ECC;
    color: #FFFFFF;
}
.content .main .main_right .card_item .card_item_foot .item_foot_right .hand:hover{
    background-color: #4697ed;
    
}